<template>
    <div>
        <el-dialog :title="'添加商品'+$route.name" :visible="goodsTypeVisible" @update:visible="v=>$emit('update:goodsTypeVisible',false)">
            <el-form>
                <el-form-item label="商品名称:" label-width="120px">
                    <el-input v-model="goodsTypeFrom.goodsTypeName" autocomplete="off" style="width:200px"></el-input>
                </el-form-item>
                <el-form-item label="所属店铺:" label-width="120px">
                    <el-select @change="fn" v-model="goodsTypeFrom.shopTypeId" placeholder="请选择店铺类型">
                        <el-option

                                v-for="item in $store.state.shop.allShopTypeList"
                                :key="item._id"
                                :label="item.shopTypeName"
                                :value="item._id">
                        </el-option>
                    </el-select>
                </el-form-item>
                <el-form-item label="店铺名称:" label-width="120px">
                                            <el-select v-model="goodsTypeFrom.shopId" placeholder="请选择店铺">
                                                <el-option
                                                        v-for="item in $store.state.shop.shopListById"
                                                        :key="item._id"
                                                        :label="item.shopName"
                                                        :value="item._id">
                                                </el-option>
                                            </el-select>
                </el-form-item>

            </el-form>
            <div slot="footer" class="dialog-footer">
                <el-button @click="$emit('update:goodsTypeVisible',false)">取 消</el-button>
                <el-button type="primary" @click="upMsg">提 交</el-button>
            </div>

        </el-dialog>

    </div>
</template>

<script>
    export default {
        name: "goodsDiaLog",
        props:{
            goodsTypeVisible:{
                type:Boolean,
                default:false
            },
            shopId:{
                type: String,
                default: ""
            },
            shopTypeId:{
                type:String,
                default:""
            }
        },
        data(){
            return{
                goodsTypeFrom:{
                    goodsTypeName:"",
                    shopTypeId:"",
                    shopId:"",

                }
            }
        },
        methods:{
            success(){

            },
            upMsg(){

                this.$store.dispatch('addGoodsTypeList',this.goodsTypeFrom)
                    .then(data=>{
                        if(data.ok===1){
                            this.$emit('update:goodsTypeVisible',false)
                            this.$store.dispatch("getGoodsTypeList")
                            if(this.$route.name!=="/goodsTypeList"){}
                        this.$router.history.push("/goodsTypeList")
                        }else{
                            this.$message.error(data.msg)
                        }
                    })
            },
            fn(){
                this.goodsTypeFrom.shopId=""
                this.$store.dispatch('getShopListById',this.goodsTypeFrom.shopTypeId)

            }
        },
        mounted() {
            if(this.$store.state.shop.allShopTypeList.length<1)
            this.$store.dispatch("allShopTypeList")

            if(this.shopTypeId){
                this.goodsTypeFrom.shopTypeId=this.shopTypeId
                if(this.shopId){
                    this.$store.dispatch('getShopListById',this.goodsTypeFrom.shopTypeId)

                    this.goodsTypeFrom.shopId=this.shopId
                }
            }

        }
    }
</script>

<style scoped>

</style>